<template>

  <!-- conFldOpr 00: == 01: != 02: > 03: >= 04: <  05: <=  06: IN 07: NOT IN  -->
  <!-- fldDataType  00:金额 01:整型02:日期 03:时间 04:星期 05:数量06:字符串 -->
  <!-- fldInputMd   00:文本框 01:下拉框 02: CHECKBOX(单选):03: CHECKBOX(多选) -->
  <form-input :required=true v-if="ruleItem.fldInputMd==='00' && ruleItem.fldDataType==='00'" :title="labelName(ruleItem.fldCname, ruleItem.conFldOpr)" :value.sync="ruleItem.fldValue" type="number"></form-input>

  <form-input :required=true v-if="ruleItem.fldInputMd==='00' && ruleItem.fldDataType==='01'" :title="labelName(ruleItem.fldCname, ruleItem.conFldOpr)" :value.sync="ruleItem.fldValue" type="number" name="money"></form-input>

  <form-input :required=true v-if="ruleItem.fldInputMd==='00' && ruleItem.fldDataType==='06'" :title="ruleItem.fldCname" :value.sync="ruleItem.fldValue"></form-input>

  <form-input :required=true v-if="ruleItem.fldDataType==='02' && ruleItem.fldName==='txn_date'" :title="ruleItem.fldCname" :value.sync="txtDate" :read-only="true"></form-input>
  
  <!-- <form-date-time :required=true v-if="ruleItem.fldInputMd==='00' && ruleItem.fldDataType==='02'" :title="ruleItem.fldCname" :value.sync="ruleItem.fldValue"></form-date-time> -->
  <form-group :required=true v-if="ruleItem.fldInputMd==='00' && ruleItem.fldDataType==='03'" :title="ruleItem.fldCname">
    <div style="float:left;">
      <form-select-time :fld-value.sync="ruleItem.fldValue[0]"></form-select-time>
      <span style="display:inline-block;width:40px;text-align:center;">  至  </span>
      <form-select-time :fld-value.sync="ruleItem.fldValue[1]"></form-select-time>
    </div>
    <div class="rules">
      <div v-if="isError" style="margin: 4px 0 0 5px;">
        <span id="actDsc-error" class="error" for="actDsc">结束时间必须大于开始时间</span>
      </div>
    </div>
  </form-group>
  <form-select :required=true v-if="ruleItem.fldInputMd==='01' && ruleItem.fldDataType==='04'" :title="ruleItem.fldCname" :value.sync="ruleItem.fldValue" :options="ruleItem.options"></form-select>
  <form-select :required=true v-if="ruleItem.fldInputMd==='01'" :title="ruleItem.fldCname" :value.sync="ruleItem.fldValue" :options="ruleItem.options"></form-select>
  <form-check-box :required=true v-if="ruleItem.fldInputMd==='02'" :title="ruleItem.fldCname" :value.sync="ruleItem.fldValue" :options="ruleItem.options"></form-check-box>
  <div class="customization" style="margin-bottom: 25px">
    <form-check-box :required=true v-if="ruleItem.fldInputMd==='03' && ruleItem.fldName==='chnl_no'" :title="ruleItem.fldCname" :value.sync="ruleItem.fldValue" :options="channels"></form-check-box>

    <form-check-box :required="ruleItem.fldName!=='fp_type'" v-if="ruleItem.fldInputMd==='03' && ruleItem.fldName!=='chnl_no'" :title="name(ruleItem.fldCname, ruleItem.fldName)" :value.sync="ruleItem.fldValue" :options="ruleItem.options"></form-check-box>
  </div>
  
</template>

<script>
import FormSelectTime from './time';
import FormCheckBox from './checkbox';
export default {
  components: {FormSelectTime, FormCheckBox},
  data: () => ({
    channels: [
      {key: '微信支付',value: 'wechat'},
      // {key: '收付直通车',value: 'paytrain'},
      {key: '银联',value: 'union'},
      {key: '支付宝',value: 'alipay'}, 
//      {key: '线下',value: 'line'},// 支付方式 wechat微信支付paytrain收付直通车union银联alipay支付宝line线下
    ],
    isError: false
  }),
  watch: {
    ruleItem: {
      deep: true,
      handler(newVal) {
        if (newVal.fldDataType === '03') {
          let startDate = "2016/08/01 " + newVal.fldValue[0].join(":");
          let endDate = "2016/08/01 " + newVal.fldValue[1].join(":");
          this.isError = Date.parse(startDate) < Date.parse(endDate) ? false : true
          this.$emit('time-rule', this.isError, this.index)
        }
      }
    }
  },
  methods: {
    // <!-- conFldOpr 00: == 01: != 02: > 03: >= 04: <  05: <=  06: IN 07: NOT IN  -->
    labelName(name, type) {
      let value;
      switch (type) {
        case '01':
          value = '不等于'
          break;
        case '02':
          value = '大于'
          break;
        case '03':
          value = '大于等于'
          break;
        case '04':
          value = '小于'
          break;
        case '05':
          value = '小于等于'
          break;
        case '06':
          value = '包括'
          break;
        case '07':
          value = '不包括'
          break;
        default:
          value = ''
      }
      return `${name}(${value})`
    },
    name(name, type) {
      let newName = ''
      if (type === 'fp_type') {
        newName = `${name}(不包括)`
      } else {
        newName = name
      }
      return newName
    }
  },
  props: {
    ruleItem: {
      type: Object,
      default: () => {}
    },
    txtDate: [String],
    index: [String, Boolean]
  },
  ready(){
  }
//   ,
//   ready(){
//       console.log('---------');
//       console.log(this.ruleItem);
//   }
}
</script>

<style lang="less" scoped>
  .form-group{
    display: flex;

  }
  label{
    margin-top: 10px;
  }
  .form-control-time {
  width: auto;
  display: inline-block;
}
.rules {
  float:left;position:relative;
  .txn_time {
    position:absolute;
    top: -21px;
    left: 10px;
  }
}
span.error {
    color: #dd4b39;
    font-size: 12px;
    margin-top: 4px;
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: bold;
}
</style>
